<template>
  <el-dialog
    v-loading.lock="loading"
    class="base-dialog system-user-dialog"
    :custom-class="'panna-dialog_big'"
    :append-to-body="true"
    :title="dataList.PlanDetail"
    align="center"
    :close-on-click-modal="false"
    :visible.sync="dialogFormVisible"
    @closed="cancel"
  >
    <DeviceMaintenancePlanView :id.sync="id"></DeviceMaintenancePlanView>
    <div slot="footer" class="dialog-footer" align="center">
      <el-button type="primary" @click="Export">{{
        dataList.Export
      }}</el-button>
      <el-button @click="cancel">{{ btn.Cancel }}</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { DeviceExportExcel } from "../../../api/Device.js";
import DeviceMaintenancePlanView from "./DeviceMaintenancePlanView.vue";
export default {
  name: "DeviceMaintenancePlanViewDialog",
  components: {
    DeviceMaintenancePlanView,
  },
  props: {
    dialogFormVisible: {
      type: Boolean,
      default: false,
    },
    id: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      tableData: [],

      loading: false,
      form: {
        num: "",
        name: "",
        endDate: "",
        statusName: "",
        creatorName: "",
        createTime: "",
      },
      tHeader: [
        "设备编号",
        "设备名称",
        "型号规格",
        "责任人",
        "责任部门",
        "维保项目",
        "计划维保时间",
        "周期",
        "维护人",
      ],
      filterVal: [
        "deviceNum",
        "deviceName",
        "specifications",
        "personResponsibleName",
        "departName",
        "project",
        "planDate",
        "cycle",
        "maintenancePersonName",
      ],
    };
  },
  computed: {
    btn() {
      return this.$t("ModuleDevice.buttons");
    },
    dataList() {
      return this.$t("ModuleDevice.Device");
    },
  },
  watch: {},
  created() {},
  methods: {
    base64ToBlob(base64String, contentType) {
      contentType = contentType || "";
      var sliceSize = 1024;
      var byteCharacters = atob(base64String);
      var bytesLength = byteCharacters.length;
      var slicesCount = Math.ceil(bytesLength / sliceSize);
      var byteArrays = new Array(slicesCount);

      for (var sliceIndex = 0; sliceIndex < slicesCount; ++sliceIndex) {
        var begin = sliceIndex * sliceSize;
        var end = Math.min(begin + sliceSize, bytesLength);
        var bytes = new Array(end - begin);
        for (var offset = begin, i = 0; offset < end; ++i, ++offset) {
          bytes[i] = byteCharacters[offset].charCodeAt(0);
        }
        byteArrays[sliceIndex] = new Uint8Array(bytes);
      }
      return new Blob(byteArrays, { type: contentType });
    },
    Export() {
      DeviceExportExcel({ type: 1, dataId: this.id }).then((res) => {
        var base64String = res.data;
        var blob = this.base64ToBlob(base64String, "application/vnd.ms-excel");

        // 创建一个可下载的链接
        var url = URL.createObjectURL(blob);
        var link = document.createElement("a");
        link.href = url;
        link.setAttribute(
          "download",
          `${this.dataList.MaintenanceScheduleList}.xlsx`
        ); // 设置文件名

        // 模拟点击链接进行下载
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      });
    },
    cancel() {
      this.$emit("update:dialogFormVisible", false);
    },
    closeDialog() {
      this.$parent.getList();
      this.cancel();
    },
  },
};
</script>
